import React, { Component } from 'react'
import PropTypes from 'prop-types' // npm i prop-types
import Item from '../Item'
import './index.css'

export default class List extends Component {
	// 对props接受的参数进行类型限制
	static propTypes = {
		todos:PropTypes.array.isRequired,
		updateTodo:PropTypes.func.isRequired,
		deleteTodo:PropTypes.func.isRequired
	}

	render() {
		const todos = this.props.todos
		return (
			<ul className="todo-main">
				{
					todos.map((todo)=>{
						return <Item key={todo.id}  {...todo} updateTodo = {this.props.updateTodo} deleteTodo={this.props.deleteTodo} />	
					})
				}
			
			 
			</ul>
		)
	}
}